<template>
  <div class="app-container">
    <!-- 查询条件区域 -->
    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="状态" prop="status">
        <el-select
          v-model="queryParams.status"
          placeholder="请输入状态"
          clearable
          style="width: 240px"
          @keyup.enter="handleQuery"
        >
          <el-option v-for="dict in statusOptions" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="月份" prop="month">
        <el-date-picker
          v-model="queryParams.month"
          type="month"
          value-format="YYYY-MM"
          placeholder="请选择月份"
          style="width: 240px"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="部门" prop="departmentName">
        <el-select
          v-model="queryParams.departmentName"
          placeholder="请选择部门"
          clearable
          style="width: 240px"
        >
          <el-option v-for="dept in departments" :key="dept.value" :label="dept.label" :value="dept.value"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="提案人" prop="proposerName">
        <el-input
          v-model="queryParams.proposerName"
          placeholder="请输入提案人姓名"
          clearable
          style="width: 240px"
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <!-- 操作按钮区域 -->
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="Plus"
          @click="handleAdd"
          v-hasPermi="['proposal:manage:add']"
        >新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="Edit"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['proposal:manage:edit']"
        >修改</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="Delete"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['proposal:manage:remove']"
        >删除</el-button>
      </el-col>
      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <!-- 提案数据表格 -->
    <el-table v-loading="loading" :data="proposalList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="状态" align="center" prop="status" :show-overflow-tooltip="true" />
      <el-table-column label="月份" align="center" prop="month" width="100" />
      <el-table-column label="部门" align="center" prop="departmentName" width="120" :show-overflow-tooltip="true" />
      <el-table-column label="提案人" align="center" prop="proposerName" width="100" />
      <el-table-column label="提案时间" align="center" prop="proposalTime" width="160">
        <template #default="scope">
          <span>{{ parseTime(scope.row.proposalTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="提案类型" align="center" prop="proposalTypeName" width="100" />
      <el-table-column label="提案名称" align="center" prop="title" width="150" :show-overflow-tooltip="true" />
      <el-table-column label="提案类别" align="center" prop="categoryName" width="100" />
      
      <!-- 评分信息 -->
      <el-table-column label="主管评分" align="center" width="100">
        <template #default="scope">
          <span :style="{ color: scope.row.supervisorTotalScore >= 30 ? '#F56C6C' : '#FF5733' }">
            {{ scope.row.supervisorTotalScore !== null ? scope.row.supervisorTotalScore : '-' }}
          </span>
        </template>
      </el-table-column>
      
      <el-table-column label="经理评分" align="center" width="100">
        <template #default="scope">
          <span :style="{ color: scope.row.managerTotalScore >= 30 ? '#F56C6C' : '#FF5733'}">
            {{ scope.row.managerTotalScore !== null ? scope.row.managerTotalScore : '-' }}
          </span>
        </template>
      </el-table-column>

      <el-table-column label="委员会评分" align="center" width="120">
        <template #default="scope">
          <span :style="{ color: scope.row.committeeTotalScore >= 30 ? '#F56C6C' : '#FF5733' }">
            {{ scope.row.committeeTotalScore !== null ? scope.row.committeeTotalScore : '-' }}
          </span>
        </template>
      </el-table-column>
      
      <el-table-column label="图片" align="center" width="120">
        <template #default="scope">
          <div v-if="scope.row.image">
            <!-- 处理多个图片的情况 -->
            <div v-if="scope.row.image.includes(',')">
              <!-- 折叠/展开按钮 -->
              <div class="image-toggle" @click="toggleImageList(scope.row)">
                <span v-if="!scope.row.showAllImages">展开全部图片 ({{ scope.row.image.split(',').length }})</span>
                <span v-else>收起图片</span>
                <el-icon :class="{ 'rotate': scope.row.showAllImages }">
                  <arrow-down />
                </el-icon>
              </div>
              
              <!-- 图片列表（可折叠） -->
              <div v-show="scope.row.showAllImages" class="image-list">
                <div v-for="(img, index) in scope.row.image.split(',')" :key="index" style="margin-bottom: 5px;">
                  <el-link 
                    :href="getImageUrl(img)" 
                    target="_blank" 
                    type="primary"
                    :underline="false">
                    图片 {{ index + 1 }}
                  </el-link>
                </div>
              </div>
            </div>
            <!-- 单张图片的情况 -->
            <div v-else>
              <el-link 
                :href="getImageUrl(scope.row.image)" 
                target="_blank" 
                type="primary"
                :underline="false">
                查看图片
              </el-link>
            </div>
          </div>
          <span v-else>无图片</span>
        </template>
      </el-table-column>
      <el-table-column label="财务介入" align="center" prop="isFinancePromoted" width="100">
        <template #default="scope">
          <dict-tag :options="sys_yes_no" :value="scope.row.isFinancePromoted ? 'Y' : 'N'" />
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" width="230" class-name="small-padding fixed-width">
        <template #default="scope">
          <el-button link type="primary" icon="View" @click="handleDetail(scope.row)">详情</el-button>         
          <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['proposal:manage:edit']">修改</el-button>
          <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['proposal:manage:remove']">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <!-- 分页组件 -->
    <pagination
      v-show="total > 0"
      :total="total"
      v-model:page="queryParams.pageNum"
      v-model:limit="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 编辑对话框 -->
    <el-dialog :title="title" v-model="open" width="700px" append-to-body>
      <el-form ref="proposalRef" :model="form" :rules="rules" label-width="100px">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="状态" prop="status">
              <el-select v-model="form.status" placeholder="请选择状态">
                <el-option label="审核中" value="审核中"></el-option>
                <el-option label="已采纳" value="已采纳"></el-option>
                <el-option label="驳回" value="驳回"></el-option>
                <el-option label="待委员会评分" value="待委员会评分"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="月份" prop="month">
              <el-date-picker
                v-model="form.month"
                type="month"
                value-format="YYYY-MM"
                placeholder="请选择月份"
                style="width: 100%"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="部门" prop="departmentName">
              <el-select v-model="form.departmentName" placeholder="请选择部门" >
                <el-option v-for="dept in departments" :key="dept.value" :label="dept.label" :value="dept.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="提案人" prop="proposerName">
              <el-input v-model="form.proposerName" placeholder="请输入提案人姓名" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="提案时间" prop="proposalTime">
              <el-date-picker
                v-model="form.proposalTime"
                type="date"
                placeholder="请选择提案时间"
                style="width: 100%"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="提案类型" prop="proposalTypeName">
              <el-select v-model="form.proposalTypeName" placeholder="请输入提案类型" >
                <el-option label="A-成本" value="A"></el-option>
                <el-option label="B-效率" value="B"></el-option>
                <el-option label="C-质量" value="C"></el-option>
                <el-option label="D-安全" value="D"></el-option>
                <el-option label="E-能源" value="E"></el-option>
                <el-option label="F-5S" value="F"></el-option>
                <el-option label="G-设备有效性" value="G"></el-option> 
                <el-option label="H-人机工效" value="H"></el-option>
                <el-option label="I-其他" value="I"></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="提案名称" prop="title">
              <el-input v-model="form.title" placeholder="请输入提案名称" />
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="提案类别" prop="categoryName">
            <el-select  v-model="form.categoryName"   style="width: 100%;">
              <el-option v-for="item in filteredCategories" :key="item" :label="item" :value="item"></el-option>
            </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24" v-if="form.image">
            <el-form-item label="当前图片">
              <div v-if="form.image && form.image.includes(',')">
                <div v-for="(img, index) in form.image.split(',')" :key="index" style="margin-bottom: 10px;">
                  <el-link 
                    :href="getImageUrl(img)" 
                    target="_blank" 
                    type="primary"
                    :underline="false">
                    图片 {{ index + 1 }}
                  </el-link>
                </div>
              </div>
              <div v-else-if="form.image">
                <el-link 
                  :href="getImageUrl(form.image)" 
                  target="_blank" 
                  type="primary"
                  :underline="false">
                  查看图片
                </el-link>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="公司推进">
              <el-radio-group v-model="form.isCompanyPromoted">
                <el-radio
                  v-for="dict in sys_yes_no"
                  :key="dict.value"
                  :label="dict.value === 'Y'"
                >{{ dict.label }}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="财务介入">
              <el-radio-group v-model="form.isFinancePromoted">
                <el-radio
                  v-for="dict in sys_yes_no"
                  :key="dict.value"
                  :label="dict.value === 'Y'"
                >{{ dict.label }}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="质量介入">
              <el-radio-group v-model="form.isQualityPromoted">
                <el-radio
                  v-for="dict in sys_yes_no"
                  :key="dict.value"
                  :label="dict.value === 'Y'"
                >{{ dict.label }}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </template>
    </el-dialog>
    
    <!-- 详情和评分详情合并对话框 -->
    <el-dialog :title="detailTitle" v-model="detailOpen" width="1000px" append-to-body>
      <el-tabs type="card">
        <!-- 基本信息 -->
        <el-tab-pane label="基本信息">
          <el-form :model="detailForm" label-width="120px">
            <!-- 基本信息 -->
            <el-card class="mb-3">
              <template #header>
                <div class="card-header">基本信息</div>
              </template>
              <el-row :gutter="20">
                <el-col :span="12">
                  <el-form-item label="状态：">
                    <span>{{ detailForm.status }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="月份：">
                    <span>{{ detailForm.month }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="部门：">
                    <span>{{ detailForm.departmentName }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="提案人：">
                    <span>{{ detailForm.proposerName }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="提案时间：">
                    <span>{{ parseTime(detailForm.proposalTime) }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="提案类型：">
                    <span>{{ detailForm.proposalTypeName }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="提案名称：">
                    <span>{{ detailForm.title }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="提案类别：">
                    <span>{{ detailForm.categoryName }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-card>

            <!-- 提案内容 -->
            <el-card class="mb-3">
              <template #header>
                <div class="card-header">提案内容</div>
              </template>
              <el-form-item label="提案内容：" v-if="detailForm.content">
                <div class="proposal-content">{{ detailForm.content }}</div>
              </el-form-item>
              <el-form-item label="备注：" v-if="detailForm.notes">
                <div class="proposal-content">{{ detailForm.notes }}</div>
              </el-form-item>
            </el-card>

            <!-- 实施信息 -->
            <el-card class="mb-3" v-if="detailForm.implementationDepartment || detailForm.implementationStartTime || detailForm.implementationEndTime">
              <template #header>
                <div class="card-header">实施信息</div>
              </template>
              <el-row :gutter="20">
                <el-col :span="12" v-if="detailForm.implementationDepartment">
                  <el-form-item label="实施部门：">
                    <span>{{ detailForm.implementationDepartment }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12" v-if="detailForm.implementationStartTime">
                  <el-form-item label="实施开始时间：">
                    <span>{{ parseTime(detailForm.implementationStartTime) }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12" v-if="detailForm.implementationEndTime">
                  <el-form-item label="实施结束时间：">
                    <span>{{ parseTime(detailForm.implementationEndTime) }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
              
              <!-- 实施人员信息 -->
              <el-divider content-position="left" v-if="hasImplementers">实施人员信息</el-divider>
              <el-row :gutter="20">
                <el-col :span="12" v-if="detailForm.implementer1Name || detailForm.implementer1EmployeeId">
                  <el-form-item label="实施人员1:">
                    <span>{{ detailForm.implementer1Name }} ({{ detailForm.implementer1EmployeeId }})</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12" v-if="detailForm.implementer2Name || detailForm.implementer2EmployeeId">
                  <el-form-item label="实施人员2:">
                    <span>{{ detailForm.implementer2Name }} ({{ detailForm.implementer2EmployeeId }})</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12" v-if="detailForm.implementer3Name || detailForm.implementer3EmployeeId">
                  <el-form-item label="实施人员3:">
                    <span>{{ detailForm.implementer3Name }} ({{ detailForm.implementer3EmployeeId }})</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12" v-if="detailForm.implementer4Name || detailForm.implementer4EmployeeId">
                  <el-form-item label="实施人员4:">
                    <span>{{ detailForm.implementer4Name }} ({{ detailForm.implementer4EmployeeId }})</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12" v-if="detailForm.implementer5Name || detailForm.implementer5EmployeeId">
                  <el-form-item label="实施人员5:">
                    <span>{{ detailForm.implementer5Name }} ({{ detailForm.implementer5EmployeeId }})</span>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-card>

            <!-- 节省金额 -->
            <el-card class="mb-3" v-if="detailForm.monthlySaving || detailForm.oneTimeSaving">
              <template #header>
                <div class="card-header">节省金额</div>
              </template>
              <el-row :gutter="20">
                <el-col :span="12" v-if="detailForm.monthlySaving !== null && detailForm.monthlySaving !== undefined">
                  <el-form-item label="持续节省：">
                    <span>{{ detailForm.monthlySaving }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12" v-if="detailForm.oneTimeSaving !== null && detailForm.oneTimeSaving !== undefined">
                  <el-form-item label="一次性节省：">
                    <span>{{ detailForm.oneTimeSaving }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-card>

            <!-- 推进信息 -->
            <el-card class="mb-3">
              <template #header>
                <div class="card-header">推进信息</div>
              </template>
              <el-row :gutter="20">
                <el-col :span="12">
                  <el-form-item label="公司推进：">
                    <span>{{ detailForm.isCompanyPromoted ? '是' : '否' }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="财务介入：">
                    <span>{{ detailForm.isFinancePromoted ? '是' : '否' }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="质量介入：">
                    <span>{{ detailForm.isQualityPromoted ? '是' : '否' }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-card>

            <!-- 可行性评估信息 -->
            <el-card class="mb-3" v-if="detailForm.feasibilityDepartment || detailForm.feasibilityResult || detailForm.feasibilityTime || detailForm.feasibilityOpinion">
              <template #header>
                <div class="card-header">可行性评估信息</div>
              </template>
              <el-row :gutter="20">
                <el-col :span="12" v-if="detailForm.feasibilityDepartment">
                  <el-form-item label="评估部门：">
                    <span>{{ detailForm.feasibilityDepartment }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12" v-if="detailForm.feasibilityResult">
                  <el-form-item label="评估结果：">
                    <span>{{ detailForm.feasibilityResult }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12" v-if="detailForm.feasibilityTime">
                  <el-form-item label="评估时间：">
                    <span>{{ parseTime(detailForm.feasibilityTime) }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="24" v-if="detailForm.feasibilityOpinion">
                  <el-form-item label="评估意见：">
                    <div class="proposal-content">{{ detailForm.feasibilityOpinion }}</div>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-card>

            <!-- 相关图片 -->
            <el-card class="mb-3" v-if="detailForm.image">
              <template #header>
                <div class="card-header">相关图片</div>
              </template>
              <el-form-item label="提案图片：">
                <div v-if="detailForm.image && detailForm.image.includes(',')">
                  <div v-for="(img, index) in detailForm.image.split(',')" :key="index" style="margin-bottom: 10px;">
                    <el-link 
                      :href="getImageUrl(img)" 
                      target="_blank" 
                      type="primary"
                      :underline="false">
                      图片 {{ index + 1 }}
                    </el-link>
                  </div>
                </div>
                <div v-else-if="detailForm.image">
                  <el-link 
                    :href="getImageUrl(detailForm.image)" 
                    target="_blank" 
                    type="primary"
                    :underline="false">
                    查看图片
                  </el-link>
                </div>
              </el-form-item>
            </el-card>
          </el-form>
        </el-tab-pane>
        
        <!-- 评分详情 -->
        <el-tab-pane label="评分详情">
          <el-tabs type="card">
            <!-- 主管评分详情 -->
            <el-tab-pane label="主管评分">
              <el-table :data="[detailForm]" border>
                <el-table-column label="完整性" prop="supervisorCompleteness" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.supervisorCompleteness !== null ? scope.row.supervisorCompleteness : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="适用性" prop="supervisorApplicability" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.supervisorApplicability !== null ? scope.row.supervisorApplicability : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="创新性" prop="supervisorInnovation" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.supervisorInnovation !== null ? scope.row.supervisorInnovation : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="安全环境" prop="supervisorSafetyEnvironment" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.supervisorSafetyEnvironment !== null ? scope.row.supervisorSafetyEnvironment : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="质量" prop="supervisorQuality" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.supervisorQuality !== null ? scope.row.supervisorQuality : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="效率" prop="supervisorEfficiency" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.supervisorEfficiency !== null ? scope.row.supervisorEfficiency : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="成本" prop="supervisorCost" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.supervisorCost !== null ? scope.row.supervisorCost : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="推广度" prop="supervisorPromotion" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.supervisorPromotion !== null ? scope.row.supervisorPromotion : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="努力度" prop="supervisorEffort" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.supervisorEffort !== null ? scope.row.supervisorEffort : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="总分" prop="supervisorTotalScore" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.supervisorTotalScore !== null ? scope.row.supervisorTotalScore : '-' }}
                  </template>
                </el-table-column>
              </el-table>
            </el-tab-pane>
            
            <!-- 经理评分详情 -->
            <el-tab-pane label="经理评分">
              <el-table :data="[detailForm]" border>
                <el-table-column label="完整性" prop="managerCompleteness" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.managerCompleteness !== null ? scope.row.managerCompleteness : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="适用性" prop="managerApplicability" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.managerApplicability !== null ? scope.row.managerApplicability : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="创新性" prop="managerInnovation" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.managerInnovation !== null ? scope.row.managerInnovation : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="安全环境" prop="managerSafetyEnvironment" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.managerSafetyEnvironment !== null ? scope.row.managerSafetyEnvironment : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="质量" prop="managerQuality" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.managerQuality !== null ? scope.row.managerQuality : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="效率" prop="managerEfficiency" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.managerEfficiency !== null ? scope.row.managerEfficiency : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="成本" prop="managerCost" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.managerCost !== null ? scope.row.managerCost : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="推广度" prop="managerPromotion" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.managerPromotion !== null ? scope.row.managerPromotion : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="努力度" prop="managerEffort" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.managerEffort !== null ? scope.row.managerEffort : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="总分" prop="managerTotalScore" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.managerTotalScore !== null ? scope.row.managerTotalScore : '-' }}
                  </template>
                </el-table-column>
              </el-table>
            </el-tab-pane>
            
            <!-- 委员会评分详情 -->
            <el-tab-pane label="委员会评分">
              <el-table :data="[detailForm]" border>
                <el-table-column label="完整性" prop="committeeCompleteness" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.committeeCompleteness !== null ? scope.row.committeeCompleteness : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="适用性" prop="committeeApplicability" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.committeeApplicability !== null ? scope.row.committeeApplicability : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="创新性" prop="committeeInnovation" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.committeeInnovation !== null ? scope.row.committeeInnovation : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="安全环境" prop="committeeSafetyEnvironment" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.committeeSafetyEnvironment !== null ? scope.row.committeeSafetyEnvironment : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="质量" prop="committeeQuality" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.committeeQuality !== null ? scope.row.committeeQuality : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="效率" prop="committeeEfficiency" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.committeeEfficiency !== null ? scope.row.committeeEfficiency : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="成本" prop="committeeCost" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.committeeCost !== null ? scope.row.committeeCost : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="推广度" prop="committeePromotion" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.committeePromotion !== null ? scope.row.committeePromotion : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="努力度" prop="committeeEffort" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.committeeEffort !== null ? scope.row.committeeEffort : '-' }}
                  </template>
                </el-table-column>
                <el-table-column label="总分" prop="committeeTotalScore" width="80" align="center">
                  <template #default="scope">
                    {{ scope.row.committeeTotalScore !== null ? scope.row.committeeTotalScore : '-' }}
                  </template>
                </el-table-column>
              </el-table>
            </el-tab-pane>
          </el-tabs>
        </el-tab-pane>
      </el-tabs>

      <template #footer>
        <div class="dialog-footer">
          <el-button @click="detailOpen = false">关 闭</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script setup name="ProposalManage">
// 引入相关依赖
import { listProposals, getProposal, delProposal, delProposalsBatch , addProposal, updateProposal } from "@/api/ciinput/proposal";
import { departments, getImageUrl } from '@/utils/proposalData';

const { proxy } = getCurrentInstance();
const { sys_yes_no } = proxy.useDict("sys_yes_no");
const baseUrl = import.meta.env.VITE_APP_BASE_API;

// 定义响应式数据
const proposalList = ref([]);
const open = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");
const detailOpen = ref(false);
const detailTitle = ref("");

const filteredCategories = computed(() => {
  const type = form.value.proposalTypeName;
  if (!type) return [];
  const categoryMap = {
    'A': ['成本'],
    'B': ['效率'],
    'C': ['质量'],
    'D': ['安全'],
    'E': ['能源'],
    'F': ['5S'],
    'G': ['设备有效性'],
    'H': ['人机工效'],
    'I': ['其他']
  };
  return categoryMap[type] || [];
});

// 筛选条件-状态
const statusOptions= ref([
  { label: "待审核", value: "待审核" },
  { label: "审核中", value: "审核中" },
  { label: "驳回", value: "驳回" },
  { label: "已采纳", value: "已采纳" },
  { label: "待委员会评分", value: "待委员会评分" }
 ])

 const toggleImageList = (row) => {
  // 初始化showAllImages属性
  if (!row.hasOwnProperty('showAllImages')) {
    row.showAllImages = false;
  }
  
  // 切换显示状态
  row.showAllImages = !row.showAllImages;
};

// 定义查询参数
const queryParams = ref({
  pageNum: 1,
  pageSize: 10,
  status: undefined,
  month: undefined,
  departmentName: undefined,
  proposerName: undefined
});

// 定义表单数据
const form = ref({});

// 详情表单数据
const detailForm = ref({});

// 详情中的实施人员信息
const hasImplementers = computed(() => {
  const form = detailForm.value;
  return form.implementer1Name || form.implementer1EmployeeId ||
         form.implementer2Name || form.implementer2EmployeeId ||
         form.implementer3Name || form.implementer3EmployeeId ||
         form.implementer4Name || form.implementer4EmployeeId ||
         form.implementer5Name || form.implementer5EmployeeId;
});

// 定义表单验证规则
const rules = ref({
  status: [{ required: true, message: "状态不能为空", trigger: "blur" }],
  month: [{ required: true, message: "月份不能为空", trigger: "blur" }],
  departmentName: [{ required: true, message: "部门不能为空", trigger: "blur" }],
  proposerName: [{ required: true, message: "提案人姓名不能为空", trigger: "blur" }],
  proposalTime: [{ required: true, message: "提案时间不能为空", trigger: "blur" }],
  proposalTypeName: [{ required: true, message: "提案类型不能为空", trigger: "blur" }],
  title: [{ required: true, message: "提案名称不能为空", trigger: "blur" }],
  categoryName: [{ required: true, message: "提案类别不能为空", trigger: "blur" }]
});


/** 查询提案列表 */
function getList() {
  loading.value = true;
  const params = { ...queryParams.value };
  
  //console.log('发送的查询参数:', params);
  
  listProposals(queryParams.value).then(response => {
    //console.log('API响应数据:', response);
    
    // 设置数据列表
    proposalList.value = response.rows || response.data || [];
    
    // 处理total值
    if (response.hasOwnProperty('total') && typeof response.total === 'number') {
      // 确保total不小于当前页面的数据量
      const minTotal = (queryParams.value.pageNum - 1) * queryParams.value.pageSize + (response.rows?.length || 0);
      total.value = Math.max(response.total, minTotal);
    } else {
      // 如果total值不正确，基于当前数据计算一个合理的值
      total.value = (queryParams.value.pageNum - 1) * queryParams.value.pageSize + (response.rows?.length || 0);
    }
    
    // 为每行数据添加showAllImages属性，初始值为false
    proposalList.value.forEach(row => {
      if (row.image && row.image.includes(',')) {
        row.showAllImages = false;
      }
    });
    
    loading.value = false;
  }).catch(error => {
    console.error('获取提案列表失败:', error);
    loading.value = false;
    // 出错时重置列表和总数
    proposalList.value = [];
    total.value = 0;
    reset();
  });
}

/** 取消按钮 */
function cancel() {
  open.value = false;
  reset();
}

/** 表单重置 */
function reset() {
  form.value = {
    id: undefined,
    status: undefined,
    month: undefined,
    departmentName: undefined,
    proposerName: undefined,
    proposalTime: undefined,
    proposalTypeName: undefined,
    title: undefined,
    categoryName: undefined,
    isCompanyPromoted: false,
    isFinancePromoted: false,
    isQualityPromoted: false,
    image: null
  };
  proxy.resetForm("proposalRef");
}

/** 搜索按钮操作 */
function handleQuery() {
  queryParams.value.pageNum = 1;
  getList();
}

/** 重置按钮操作 */
function resetQuery() {
  proxy.resetForm("queryRef");
  handleQuery();
}

/** 多选框选中数据 */
function handleSelectionChange(selection) {
  ids.value = selection.map(item => item.id);
  single.value = selection.length !== 1;
  multiple.value = !selection.length;
}

/** 新增按钮操作 */
function handleAdd() {
  reset();
  open.value = true;
  title.value = "添加提案";
}

/** 修改按钮操作 */
function handleUpdate(row) {
  reset();
  const id = row.id || ids.value[0];
  getProposal(id).then(response => {
    form.value = response.data;
    //id
    form.value.id = id;
    //布尔值转换
    form.value.isCompanyPromoted = response.data.isCompanyPromoted === true || response.data.isCompanyPromoted === 'Y';
    form.value.isFinancePromoted = response.data.isFinancePromoted === true || response.data.isFinancePromoted === 'Y';
    form.value.isQualityPromoted = response.data.isQualityPromoted === true || response.data.isQualityPromoted === 'Y';
    open.value = true;
    title.value = "修改提案";
  });
}

/** 提交按钮 */
function submitForm() {
  proxy.$refs["proposalRef"].validate(valid => {
    if (valid) {

      const submitData = {...form.value};
      //console.log('提交的参数:', submitData);

      if (form.value.id !== undefined) {
        updateProposal(submitData).then(response => {
          proxy.$modal.msgSuccess("修改成功");
          open.value = false;
          getList();
        });
      } else {
        addProposal(submitData).then(response => {
          proxy.$modal.msgSuccess("新增成功");
          open.value = false;
          getList();
        });
      }
    }
  });
}

/** 删除按钮操作 */
function handleDelete(row) {
  const proposalIds = row.id || ids.value;
  proxy.$modal.confirm('是否确认删除提案编号为"' + proposalIds + '"的数据项？').then(function() {
    // 判断是单个删除还是批量删除
    if (Array.isArray(proposalIds)) {
      // 批量删除
      return delProposalsBatch(proposalIds);
    } else {
      // 单个删除
      return delProposal(proposalIds);
    }
  }).then(() => {
    getList();
    proxy.$modal.msgSuccess("删除成功");
  }).catch(() => {});
}

/** 显示提案详情和评分详情 */
function handleDetail(row) {
  getProposal(row.id).then(response => {
    detailForm.value = { ...response.data };
    detailTitle.value = "提案详情";
    detailOpen.value = true;
  }).catch(error => {
    proxy.$modal.msgError("获取提案详情失败: " + (error.message || error));
  });
}

// 页面加载时获取数据
getList();
</script>

<style scoped>
.image-toggle {
  cursor: pointer;
  color: #409eff;
  font-size: 12px;
  padding: 2px 0;
  display: flex;
  align-items: center;
  gap: 4px;
}

.image-toggle:hover {
  text-decoration: underline;
}

.rotate {
  transform: rotate(180deg);
}

.image-list {
  margin-top: 8px;
  max-height: 200px;
  overflow-y: auto;
  border: 1px solid #ebeef5;
  border-radius: 4px;
  padding: 8px;
  background-color: #f5f7fa;
}

.image-list::-webkit-scrollbar {
  width: 6px;
}

.image-list::-webkit-scrollbar-track {
  background: #f5f7fa;
  border-radius: 3px;
}

.image-list::-webkit-scrollbar-thumb {
  background: #c0c4cc;
  border-radius: 3px;
}

.image-list::-webkit-scrollbar-thumb:hover {
  background: #909399;
}

.proposal-content {
  white-space: pre-wrap;
  line-height: 1.6;
  color: #333;
  padding: 10px;
  background-color: #f9f9f9;
  border-radius: 4px;
  border: 1px solid #eee;
  min-height: 20px;
}

.mb-3 {
  margin-bottom: 15px;
}

.card-header {
  font-weight: bold;
  color: #333;
}
</style>